<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
    <th:block th:include="include :: header('审计记录列表')" />
    <th:block th:include="include :: bootstrap-select-css" />
</head>
<body class="gray-bg">
<div class="container-div">
    <div class="row">
        <div class="col-sm-12 search-collapse">
            <form id="audit-form">
                <div class="select-list">
                    <ul>
                        <li>
                            <label>操作地址：</label><input type="text" name="ip"/>
                        </li>
                        <li>
                            <label>系统模块： </label><input type="text" name="title"/>
                        </li>
                        <li>
                            <label>操作人员： </label><input type="text" name="who"/>
                        </li>
                        <li class="select-selectpicker">
                            <label>操作类型： </label><select id="types" name="types" th:with="type=${@dict.getType('zknj_audit_type')}" class="selectpicker" data-none-selected-text="请选择" multiple>
                                <option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}"></option>
                            </select>
                        </li>
                        <li>
                            <label>操作状态：</label><select name="operStatus" th:with="type=${@dict.getType('sys_common_status')}">
                                <option value="">所有</option>
                                <option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}"></option>
                            </select>
                        </li>
                        <li class="select-time">
                            <label>操作时间： </label>
                            <input type="text" class="time-input" id="startTime" placeholder="开始时间"/>
                            <span>-</span>
                            <input type="text" class="time-input" id="endTime" placeholder="结束时间"/>
                        </li>
                        <li>
                            <a class="btn btn-primary btn-rounded btn-sm" onclick="searchPre()"><i class="fa fa-search"></i>&nbsp;搜索</a>
                            <a class="btn btn-warning btn-rounded btn-sm" onclick="resetPre()"><i class="fa fa-refresh"></i>&nbsp;重置</a>
                        </li>
                    </ul>
                </div>
            </form>
        </div>

        <div class="btn-group-sm" id="toolbar" role="group">
            <a class="btn btn-warning" onclick="$.table.exportExcel()" shiro:hasPermission="monitor:operlog:export">
                <i class="fa fa-download"></i> 导出
            </a>
        </div>

        <div class="col-sm-12 select-table table-striped">
            <table id="bootstrap-table"></table>
        </div>
    </div>
</div>

<th:block th:include="include :: footer" />
<th:block th:include="include :: bootstrap-select-js" />
<script th:inline="javascript">
    var detailFlag = [[${@permission.hasPermi('system:audit:detail')}]];
    var datas = [[${@dict.getType('zknj_audit_action')}]];
    var prefix = ctx + "system/audit";

    $(function() {
        var options = {
            url: prefix + "/list",
            detailUrl: prefix + "/detail/{id}",
            exportUrl: prefix + "/export",
            queryParams: queryParams,
            sortName: "time",
            sortOrder: "desc",
            modalName: "审计追踪",
            escape: true,
            showPageGo: true,
            rememberSelected: true,
            // columns: [{
            //     field: 'state',
            //     checkbox: true
            // },
            //     {
            //         field: 'auditId',
            //         title: '审计编号',
            //         visible: false
            //     },
            //     {
            //         field: 'time',
            //         title: '时间',
            //         sortable: true
            //     },
            //     {
            //         field: 'who',
            //         title: '操作人员',
            //         sortable: true
            //     },
            //     {
            //         field: 'what',
            //         title: '操作内容'
            //     },
            //     {
            //         field: 'type',
            //         title: '操作类型',
            //         align: 'center',
            //         formatter: function(value, row, index) {
            //             return $.table.selectDictLabel(datas, value);
            //         }
            //     },
            //     {
            //         field: 'ip',
            //         title: '操作地址'
            //     },
            //     {
            //         field: 'wher',
            //         title: '操作地点'
            //     },
            //     {
            //         field: 'title',
            //         title: '系统模块',
            //         formatter: function(value, row, index) {
            //             return $.table.tooltip(value);
            //         }
            //     },
            //     {
            //         field: 'operStatus',
            //         title: '操作状态',
            //         align: 'center',
            //         formatter: function(value, row, index) {
            //             if (value == 0) {
            //                 return '<span class="badge badge-primary">成功</span>';
            //             } else if (value == 1) {
            //                 return '<span class="badge badge-danger">失败</span>';
            //             }
            //         }
            //     },
            //     {
            //         title: '操作',
            //         align: 'center',
            //         formatter: function(value, row, index) {
            //             var actions = [];
            //             actions.push('<a class="btn btn-warning btn-xs ' + detailFlag + '" href="javascript:void(0)" onclick="$.operate.detail(\'' + row.auditId + '\')"><i class="fa fa-search"></i>详细</a>');
            //             return actions.join('');
            //         }
            //     }]
            columns: [{
                field: 'state',
                checkbox: true
            },
                {
                    field: 'auditId',
                    title: '审计编号',
                    visible: false
                },
                {
                    field: 'title',
                    title: '类别',
                    formatter: function(value, row, index) {
                        return $.table.tooltip(value);
                    }
                },
                {
                    field: 'who',
                    title: '操作人员',
                    sortable: true
                },
                {
                    field: 'role',
                    title: '角色'
                },
                {
                    field: 'type',
                    title: 'Action',
                    align: 'center',
                    formatter: function(value, row, index) {
                        return $.table.selectDictLabel(datas, value);
                    }
                },
                {
                    field: 'time',
                    title: '时间',
                    sortable: true
                },
                {
                    field: 'what',
                    title: '内容',
                    formatter: function(value, row, index) {
                        var inf = [];
                        inf.push('<span class="fs-5">' + value + '</span><br/>');

                        var auditParamsStr = row.auditParams;
                        var params = {};

                        // 容错解析 JSON
                        try {
                            if (typeof auditParamsStr === 'string' && auditParamsStr.trim() !== '') {
                                params = JSON.parse(auditParamsStr);
                            }
                        } catch (e) {
                            console.warn('auditParams JSON 解析失败:', auditParamsStr, e);
                            params = null; // 显式设为 null，表示解析失败
                        }

                        if (!params || Object.keys(params).length === 0) {
                            // 如果为空或解析失败
                            inf.push('<span class="text-muted"></span>');
                            return inf.join('');
                        }

                        // 构建参数显示列表
                        var paramList = [];
                        var count = 0;
                        var limit = 4;
                        var maxValLen = 60;

                        Object.entries(params).forEach(function([key, val]) {
                            if (key && val) {
                                if (count < limit) {
                                    var displayVal = val;
                                    if (val.length > maxValLen) {
                                        displayVal = val.substring(0, maxValLen) + '...';
                                    }

                                    paramList.push(
                                        '<li><span class="text-secondary">' + key + '</span>: ' +
                                        '<span title="' + val + '">' + displayVal + '</span></li>'
                                    );
                                }
                                count++;
                            }
                        });

                        if (paramList.length > 0) {
                            inf.push('<ul style="padding-left: 1em; margin: 0; list-style-type: disc;">' + paramList.join('') + '</ul>');
                            if (count > limit) {
                                inf.push('<span class="text-muted small">......</span>');
                            }
                        } else {
                            inf.push('<span class="text-muted">-</span>');
                        }

                        return inf.join('');
                    }
                },
                {
                    field: 'comment',
                    title: 'comment',
                    visible: false,
                    formatter: function(value, row, index) {
                        if(value == null || value == ''){
                            return '<a href="javascript:void(0)"> - </a>';
                        }
                        return '<a href="javascript:void(0)" title="查看审核意见" onclick="showComment(\'' + value + '\')"><i class="fa fa-search"></i></a>';
                    }
                },
                {
                    field: 'ip',
                    title: 'ip地址',
                    visible: false
                },
                {
                    field: 'wher',
                    title: '访问方式',
                    visible: false
                },
                {
                    field: 'operStatus',
                    title: '结果',
                    align: 'center',
                    formatter: function(value, row, index) {
                        if (value == 0) {
                            return '<span class="badge badge-primary">成功</span>';
                        } else if (value == 1) {
                            return '<span class="badge badge-danger">失败</span>';
                        }
                    }
                },
                {
                    title: '操作',
                    // align: 'center',
                    formatter: function(value, row, index) {
                        var actions = [];
                        var detail = '<a class="btn btn-warning btn-xs ' + detailFlag + '" href="javascript:void(0)" onclick="$.operate.detail(\'' + row.auditId + '\')"><i class="fa fa-search"></i> 详细</a>';
                        // var comment = '<a class="btn btn-info btn-xs ' + commentFlag + '" href="javascript:void(0)" onclick="comment(\'' + row.auditId + '\')"><i class="fa fa-edit"></i> 意见</a>';
                        //
                        // if (row.comment) {
                        //     actions.push('<span class="badge badge-success">已评论</span>');
                        // } else {
                        //     actions.push(comment);
                        // }
                        actions.push(detail);

                        return actions.join('');
                    }
                }]
        };
        $.table.init(options);
    });

    function queryParams(params) {
        var search = $.table.queryParams(params);
        search.params = {
            beginTime : beginOfTime($("#startTime").val()),
            endTime : endOfTime($("#endTime").val())
        };
        search.types = $.common.join($('#types').selectpicker('val'));
        return search;
    }

    function showComment(value) {
        $.modal.alertSuccess(value);
    }

    function searchPre() {
        $.table.search('audit-form', 'bootstrap-table');
    }

    function resetPre() {
        resetDate();
        $("#audit-form")[0].reset();
        $("#types").selectpicker('refresh');
        $.table.search('audit-form', 'bootstrap-table', 1);
    }
</script>
</body>
</html>